<html>
<head>
    <title>菜单管理</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <script language="javascript" src="/static/js/jquery-3.5.1.min.js"></script>
    <script language="javascript" src="/static/js/import.js"></script>
    <script language="javascript">
        function addMenu(id){
            $("#menuForm input").val(null);
            $("#menuForm select").val(null);
            $("#menuForm textarea").val(null);
            if(id){
                $("#menuForm input[name='parentId']").val(id);
            }
            $("#myModal").modal("show");
        };
        function modMenu(id){
            var nodes = $("#menuTree").treeview("getNodes",[id,"id"]);
            $("#menuForm input").val(null);
            $("#menuForm select").val(null);
            $("#menuForm textarea").val(null);
            $.each(nodes[0],function (key,value) {
                $("#menuForm input[name='"+key+"']").val(value);
                $("#menuForm select[name='"+key+"']").val(value);
                $("#menuForm textarea[name='"+key+"']").val(value);
            });
            $("#menuForm input[name='parentId']").val(nodes[0].pId==0?null:nodes[0].pId);
            $("#myModal").modal("show");
        };
        function delMenu(id){
            var nodes = $("#menuTree").treeview("getNodes",[id,"id"]);
            Dialog.confirm({
                title:"删除确认",
                message:"是否确认删除菜单："+nodes[0].text,
                callback:function (confirmed) {
                    if(confirmed){
                        $.ajax({
                            url: "/menu/del.do",
                            type: "post",
                            data:{id:id},
                            success: function (data) {
                                if(data.code == 200){
                                    refreshTree();
                                    Message.success("删除成功！")
                                }else{
                                    Message.danger(data.msg);
                                }
                            }
                        });
                    }
                }
            });
        };
        function refreshTree(){
            $.ajax({
                url: "/menu/tree.do",
                type: "post",
                data: {mode:"menu"},
                success: function (menuNodes) {
                    if(!menuNodes){
                        return;
                    }
                    $("#menuTree").treeview({
                        data:menuNodes,
                        levels: 3,
                        showIcon: true,
                        showTags: true,
                        selectable: true,
                        expandIcon: 'bi bi-caret-down-fill',
                        collapseIcon: 'bi bi-caret-right-fill',
                        showBorder: false
                    });
                }
            });
        };
        $(function(){
            refreshTree();
            $("#menuForm").ajaxForm({
                url: "/menu/save.do",
                type: "post",
                success: function(result){
                    if(result.code == 200){
                        refreshTree();
                        $("#myModal").modal("hide");
                        Message.success("保存成功！");
                    }else {
                        Message.danger(result.msg);
                    }
                }
            });
        });
    </script>
</head>
<body>
<div class="mt-3" id="menuTree"></div>
<div class="modal fade modal-dialog position-absolute" id="myModal" style="margin-top:100px;margin-left: -250px;left:50%">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <form id="menuForm">
                <div class="modal-body" style="height: 350px;width: 500px">
                    <input type="hidden" name="id">
                    <input type="hidden" name="parentId">
                    <label for="text">菜单名称：</label>
                    <input type="text" id="text" name="text" class="form-control">
                    <label for="code">菜单编码：</label>
                    <input type="text" id="code" name="code" class="form-control">
                    <label for="uri">菜单uri：</label>
                    <textarea class="form-control" id="uri" name="uri" ></textarea>
                    <label for="seq">菜单排序：</label>
                    <input type="number" id="seq" name="seq" class="form-control">
                    <label for="type">菜单类型：</label>
                    <select class="form-select" id="type" name="type">
                        <option>系统</option>
                        <option>模块</option>
                        <option>功能</option>
                    </select>
                </div>
                <div class="modal-footer">
                    <button type="submit" class="btn btn-primary">保存</button>
                </div>
            </form>
        </div>
    </div>
</div>
</body>
</html>
